<html>
<meta charset="utf-8">

<head>
    <link rel="stylesheet" type="text/css" href="mySheet.css">
    <style>
        p {
            font-size: 20px;
        }
    </style>
</head>
<div>
    <ul>
        <li>外部样式表(External style sheet)</li>
        <li>内部样式表(Internal style sheet)</li>
        <li> 内联样式(Inline style)</li>
        <li style="background-color:bisque">样式优先级：内联》内部》外部》浏览器默认</li>
    </ul>
    <div class="dv_show">使用外部样式表 <br> 当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 link 标签链接到样式表。 link 标签在（文档的）头部：
    </div>
    <p>使用内部样式表 当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使用 style 标签在文档头部定义内部样式表</p>
    <span style="color:blue;height:200px;width:300px;background-color:aquamarine">使用内联样式 <br>
        由于要将表现和内容混杂在一起，内联样式会损失掉样式表的许多优势。请慎用这种方法
    </span>
</div>

</html>